import QtQuick 2.0

Item {
    id: calendar
    transform: Scale {xScale: 2; yScale: 2}

    property string theme: "green"
    property string topcolor: "#FF38761D"
    property string activedcolor: "#FF6AA84F"
    property string unactivedcolor: "#FF93C47D"
    property string txtcolor: "#FFFFFF"
    property int dateSize: 9
    property int eventSize: 7
    property string clickedDay: ""
    property string clickedEvent: ""
    property string currentMonth: ""
    property string currentYear: ""
    property string addEvent

    property int sign: 0

    function setTheme(){
        if(calendar.theme === "green"){
            calendar.topcolor = "#FF38761D"
            calendar.activedcolor = "#FF6AA84F"
            calendar.unactivedcolor = "#FF93C47D"
        }else if(calendar.theme === "blue"){
            calendar.topcolor = "#FF0B5394"
            calendar.activedcolor = "#FF3D85C6"
            calendar.unactivedcolor = "#FF6FA8DC"
        }else if(calendar.theme === "red"){
            calendar.topcolor = "#FF990000"
            calendar.activedcolor = "#FFCC0000"
            calendar.unactivedcolor = "#FFE06666"
        }
    }

    Component.onCompleted: {
        //var dateTime = new Date();
        //calendar.dateChanged(calendar, dateTime, sign);
    }

    function dateChanged(main, date, current) {
        var mm = new Array(11);
        mm[0] = "April";
        mm[1] = "April";
        mm[2] = "May";
        mm[3] = "May";
        mm[4] = "May";
        mm[5] = "May";
        mm[6] = "June";
        mm[7] = "June";
        mm[8] = "March";
        mm[9] = "March";
        mm[10] = "March";
        var dd = new Array(11);
        dd[0] = 1;
        dd[1] = 22;
        dd[2] = 5;
        dd[3] = 12;
        dd[4] = 18;
        dd[5] = 27;
        dd[6] = 14;
        dd[7] = 16;
        dd[8] = 17;
        dd[9] = 29;
        dd[10] = 31;
        var event = new Array(11);
        event[0] = "Fool's Day";
        event[1] = "Earth Day";
        event[2] = "Cinco de Mayo";
        event[3] = "Mother's Day";
        event[4] = "Armed Forces Day";
        event[5] = "Memorial Day";
        event[6] = "Flag Day";
        event[7] = "Father's Day";
        event[8] = "St. Patrick's Day";
        event[9] = "Good Friday";
        event[10] = "Easter Sunday";

        var e = new Array(5);
        e[0] = "10:00 AM - 10:50 AM:\nCS 422 User Interface Design & Programming";
        e[1] = "9:30 AM - 10:45 AM:\nCS 590 Research Methods in Computer Science";
        e[2] = "10:00 AM - 10:50 AM:\nCS 422 User Interface Design & Programming\n\n1:00 PM - 2:00 PM:\nEVL Tech Meeting";
        e[3] = "9:30 AM - 10:45 AM:\nCS 590 Research Methods in Computer Science";
        e[4] = "10:00 AM - 10:50 AM:\nCS 422 User Interface Design & Programming";

        var months = new Array(12);
        months[0]  = "January";
        months[1]  = "February";
        months[2]  = "March";
        months[3]  = "April";
        months[4]  = "May";
        months[5]  = "June";
        months[6]  = "July";
        months[7]  = "August";
        months[8]  = "September";
        months[9]  = "October";
        months[10] = "November";
        months[11] = "December";

        var dayIds = new Array(42);
        dayIds[0]  = day01; dayIds[1]  = day02; dayIds[2]  = day03; dayIds[3]  = day04; dayIds[4]  = day05; dayIds[5]  = day06; dayIds[6]  = day07;
        dayIds[7]  = day08; dayIds[8]  = day09; dayIds[9]  = day10; dayIds[10] = day11; dayIds[11] = day12; dayIds[12] = day13; dayIds[13] = day14;
        dayIds[14] = day15; dayIds[15] = day16; dayIds[16] = day17; dayIds[17] = day18; dayIds[18] = day19; dayIds[19] = day20; dayIds[20] = day21;
        dayIds[21] = day22; dayIds[22] = day23; dayIds[23] = day24; dayIds[24] = day25; dayIds[25] = day26; dayIds[26] = day27; dayIds[27] = day28;
        dayIds[28] = day29; dayIds[29] = day30; dayIds[30] = day31; dayIds[31] = day32; dayIds[32] = day33; dayIds[33] = day34; dayIds[34] = day35;
        dayIds[35] = day36; dayIds[36] = day37; dayIds[37] = day38; dayIds[38] = day39; dayIds[39] = day40; dayIds[40] = day41; dayIds[41] = day42;


        var today = date.getDate() -1;
        var currentmonth;
        var currentyear;
        if ((date.getMonth()+current)<0) {
            currentmonth = 12 - (Math.abs(date.getMonth()+current))%12;
            currentyear = date.getFullYear()-Math.ceil(Math.abs((date.getMonth()+current))/12);
        }
        else {
            currentmonth = (date.getMonth()+current)%12;
            currentyear = date.getFullYear()+Math.floor((date.getMonth()+current)/12);
        }

        date.setDate(1);
        date.setMonth(currentmonth);
        date.setYear(currentyear);
        var firstday = date.getDay();
        var numDays = new Date(currentyear, currentmonth+1, 0).getDate();

        monthTxt.text = months[currentmonth]+", "+currentyear;
        currentMonth = months[currentmonth];
        currentYear = currentyear;

        var i;
        var j;
        for(i=0; i<42; i++){
            dayIds[today+firstday].color = calendar.activedcolor;
            dayIds[today+firstday].children[0].color = txtcolor;
            dayIds[i].children[1].text = "";
            if (i<firstday || i>=(firstday+numDays)){
                dayIds[i].children[0].text = "";
                dayIds[i].color = calendar.unactivedcolor;// "#ff93c47d"; //"#ffd9ead3";
                dayIds[i].children[2].visible = false;
            }
            else {
                dayIds[i].children[0].text = (i-firstday+1);
                dayIds[i].color = calendar.activedcolor;
                dayIds[i].children[2].visible = true;

                var key = "calendar/" + userSelection.loggedUser + "/event/" + currentYear + "/" + currentMonth + "/" + dayIds[i].children[0].text;
                //dayIds[i].children[1].text = settings.getValue(key);
                //dayIds[i].children[1].text = settings.getValue(key);
                if( settings.getValue(key) != "" ) {
                    dayIds[i].children[1].text = "Events";
                }
                dayIds[i].children[3].text = settings.getValue(key);


                for (j=0; j<11; j++) {
                    if (mm[j]===currentMonth && dd[j]===(i-firstday+1)) {
                        dayIds[i].children[1].text = event[j];
                    }
                }
            }
        }

        if (current===0) {
            dayIds[today+firstday].color = calendar.topcolor;
            dayIds[today+firstday].children[0].color = txtcolor;
        }
        else {
            dayIds[firstday].color = calendar.topcolor;
            dayIds[firstday].children[0].color = txtcolor;
        }
    }

    function creatEvents (day, month, year, eventString, date) {
        var months = new Array(12);
        months[0]  = "January";
        months[1]  = "February";
        months[2]  = "March";
        months[3]  = "April";
        months[4]  = "May";
        months[5]  = "June";
        months[6]  = "July";
        months[7]  = "August";
        months[8]  = "September";
        months[9]  = "October";
        months[10] = "November";
        months[11] = "December";

        var months2id = new Array(12);
        months2id["January"]   = 0;
        months2id["February"]  = 1;
        months2id["March"]     = 2;
        months2id["April"]     = 3;
        months2id["May"]       = 4;
        months2id["June"]      = 5;
        months2id["July"]      = 6;
        months2id["August"]    = 7;
        months2id["September"] = 8;
        months2id["October"]   = 9;
        months2id["November"]  = 10;
        months2id["December"]  = 11;

        var dayIds = new Array(42);
        dayIds[0]  = day01; dayIds[1]  = day02; dayIds[2]  = day03; dayIds[3]  = day04; dayIds[4]  = day05; dayIds[5]  = day06; dayIds[6]  = day07;
        dayIds[7]  = day08; dayIds[8]  = day09; dayIds[9]  = day10; dayIds[10] = day11; dayIds[11] = day12; dayIds[12] = day13; dayIds[13] = day14;
        dayIds[14] = day15; dayIds[15] = day16; dayIds[16] = day17; dayIds[17] = day18; dayIds[18] = day19; dayIds[19] = day20; dayIds[20] = day21;
        dayIds[21] = day22; dayIds[22] = day23; dayIds[23] = day24; dayIds[24] = day25; dayIds[25] = day26; dayIds[26] = day27; dayIds[27] = day28;
        dayIds[28] = day29; dayIds[29] = day30; dayIds[30] = day31; dayIds[31] = day32; dayIds[32] = day33; dayIds[33] = day34; dayIds[34] = day35;
        dayIds[35] = day36; dayIds[36] = day37; dayIds[37] = day38; dayIds[38] = day39; dayIds[39] = day40; dayIds[40] = day41; dayIds[41] = day42;

        var currentmonth = months2id[currentMonth];
        var currentyear = currentYear;

        date.setDate(1);
        date.setMonth(currentmonth);
        date.setYear(currentYear);
        var firstday = date.getDay();
        var numDays = new Date(currentYear, currentmonth+1, 0).getDate();

        dayIds[parseInt(day) + firstday - 1].children[3].text = dayIds[parseInt(day) + firstday - 1].children[3].text + "\n\n" + eventString;
        dayIds[parseInt(day) + firstday - 1].children[1].text = "New events!";
        var key = "calendar/" + userSelection.loggedUser + "/event/" + year + "/" + month + "/" + day;

        var value = settings.getValue(key);
        settings.setValue(key, value + "\n\n" + eventString);
        calendarDetailText.text = settings.getValue(key);
    }

    Rectangle {
        x: parent.x+60
        y: parent.y
        width: 700
        height: 400
        Rectangle {
            id: month
            anchors.left: parent.left
            anchors.top: parent.top
            width: parent.width
            height: 48
            color: calendar.topcolor
            border { width: 1; color: "#FFFFFF"; }
            Text {
                id: monthTxt
                anchors.centerIn: parent
                text: "Month"
                //property string engTxt: "Month"
                //text: Qt.formatDateTime(new Date(), "MMMM, yyyy")
                //text: calendar.currentmonth+", "+calendar.currentyear
                color: calendar.txtcolor
                font { family: "Verdana"; pointSize: 16; bold: true; }
            }
            /*MouseArea {
                anchors.fill: parent
                onPressed:  {
                    dark.visible = false;
                    calendarDetail.visible = false;
                }
            }*/
            Image {
                id: goLeft
                anchors.left: parent.left
                anchors.leftMargin: 5
                y: 15
                width: 20
                height: 20
                source: "images/arrow_left.png"
                MouseArea {
                    anchors.fill: parent
                    onClicked:  {
                        sign = sign - 1;
                        //if(sign < 0) sign = 11;
                        //if(sign > 11) sign = 0;
                        var dateTime = new Date();
                        calendar.dateChanged(calendar, dateTime, sign);
                    }
                }
            }
            Image {
                id: goRight
                anchors.right: parent.right
                anchors.rightMargin: 5
                y: 15
                width: 20
                height: 20
                source: "images/arrow_right.png"
                MouseArea {
                    anchors.fill: parent
                    onClicked:  {
                        sign = sign + 1;
                        var dateTime = new Date();
                        calendar.dateChanged(calendar, dateTime, sign);
                    }
                }
            }
        }
        Grid {
            id: dayGrid
            anchors.left: parent.left
            anchors.leftMargin: 1
            anchors.top: parent.top
            anchors.topMargin: 48
            width: parent.width-8
            height: parent.height-55
            columns: 7
            rows: 7
            spacing: 1
            Rectangle {
                id: sun
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: calendar.topcolor
                Text {
                    anchors.centerIn: parent
                    text: "Sun"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: 16; bold: true; }
                }
            }
            Rectangle {
                id: mon
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: calendar.topcolor
                Text {
                    anchors.centerIn: parent
                    text: "Mon"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: 16; bold: true; }
                }
            }
            Rectangle {
                id: tue
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: calendar.topcolor
                Text {
                    anchors.centerIn: parent
                    text: "Tue"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: 16; bold: true; }
                }
            }
            Rectangle {
                id: wed
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: calendar.topcolor
                Text {
                    anchors.centerIn: parent
                    text: "Wed"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: 16; bold: true; }
                }
            }
            Rectangle {
                id: thu
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: calendar.topcolor
                Text {
                    anchors.centerIn: parent
                    text: "Thu"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: 16; bold: true; }
                }
            }
            Rectangle {
                id: fri
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: calendar.topcolor
                Text {
                    anchors.centerIn: parent
                    text: "Fri"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: 16; bold: true; }
                }
            }
            Rectangle {
                id: sat
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: calendar.topcolor
                Text {
                    anchors.centerIn: parent
                    text: "Sat"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: 16; bold: true; }
                }
            }
            Rectangle {
                id: day01
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }                
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day01.children[0].text;
                        clickedEvent = day01.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day02
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }                
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day02.children[0].text;
                        clickedEvent = day02.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day03
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }                
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day03.children[0].text;
                        clickedEvent = day03.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day04
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day04.children[0].text;
                        clickedEvent = day04.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day05
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day05.children[0].text;
                        clickedEvent = day05.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day06
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day06.children[0].text;
                        clickedEvent = day06.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day07
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day07.children[0].text;
                        clickedEvent = day07.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day08
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day08.children[0].text;
                        clickedEvent = day08.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day09
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day09.children[0].text;
                        clickedEvent = day09.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day10
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day10.children[0].text;
                        clickedEvent = day10.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day11
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day11.children[0].text;
                        clickedEvent = day11.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day12
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day12.children[0].text;
                        clickedEvent = day12.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day13
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day13.children[0].text;
                        clickedEvent = day13.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day14
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day14.children[0].text;
                        clickedEvent = day14.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day15
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day15.children[0].text;
                        clickedEvent = day15.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day16
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day16.children[0].text;
                        clickedEvent = day16.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day17
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day17.children[0].text;
                        clickedEvent = day17.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day18
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day18.children[0].text;
                        clickedEvent = day18.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day19
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day19.children[0].text;
                        clickedEvent = day19.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day20
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day20.children[0].text;
                        clickedEvent = day20.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day21
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day21.children[0].text;
                        clickedEvent = day21.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day22
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day22.children[0].text;
                        clickedEvent = day22.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day23
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day23.children[0].text;
                        clickedEvent = day23.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day24
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day24.children[0].text;
                        clickedEvent = day24.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day25
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day25.children[0].text;
                        clickedEvent = day25.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day26
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day26.children[0].text;
                        clickedEvent = day26.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day27
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day27.children[0].text;
                        clickedEvent = day27.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day28
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day28.children[0].text;
                        clickedEvent = day28.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day29
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day29.children[0].text;
                        clickedEvent = day29.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day30
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day30.children[0].text;
                        clickedEvent = day30.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day31
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day31.children[0].text;
                        clickedEvent = day31.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day32
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day32.children[0].text;
                        clickedEvent = day32.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day33
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day33.children[0].text;
                        clickedEvent = day33.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day34
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day34.children[0].text;
                        clickedEvent = day34.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day35
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day35.children[0].text;
                        clickedEvent = day35.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day36
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day36.children[0].text;
                        clickedEvent = day36.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day37
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day37.children[0].text;
                        clickedEvent = day37.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day38
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day38.children[0].text;
                        clickedEvent = day38.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day39
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day39.children[0].text;
                        clickedEvent = day39.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day40
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day40.children[0].text;
                        clickedEvent = day40.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day41
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day41.children[0].text;
                        clickedEvent = day41.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
            Rectangle {
                id: day42
                width: parent.width / parent.columns
                height: parent.height / parent.rows
                color: content.color
                Text {
                    //anchors.centerIn: parent
                    anchors.top: parent.top
                    anchors.topMargin: 5
                    anchors.left: parent.left
                    anchors.leftMargin: 5
                    text: "#"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: true; }
                }
                Text {
                    anchors.centerIn: parent
                    text: ""
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: eventSize; bold: true; }
                }
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = true;
                        calendarDetail.visible = true;
                        clickedDay = day42.children[0].text;
                        clickedEvent = day42.children[3].text;
                    }
                }
                Text {
                    visible: false;
                    text: ""
                }
            }
        }

        Rectangle {
            id: dark
            visible: false
            anchors.fill: parent
            //width: parent.width
            //height: parent.height
            opacity: 0.3
            color: "black"
        }
        Rectangle {
            id: calendarDetail
            visible: false
            anchors.top: parent.top
            anchors.topMargin: 125;
            anchors.horizontalCenter: parent.horizontalCenter
            //x: (day02.x+day03.x)/2
            //y: (day03.y+day10.y)/2
            width: 350
            height: 250
            color: calendar.topcolor
            border.width: 2
            border.color: "#FF000000"
            opacity: 0.8
            Text {
                anchors.top: parent.top
                anchors.topMargin: 5
                anchors.left: parent.left
                anchors.leftMargin: 5
                text: currentMonth+" "+clickedDay+", "+currentYear
                opacity: 2
                color: calendar.txtcolor
                font { family: "Verdana"; pointSize: dateSize; bold: true; }
                onTextChanged: {
                    var key = "calendar/" + userSelection.loggedUser + "/event/" + currentYear + "/" + currentMonth + "/" + clickedDay;
                    calendarDetailText.text = settings.getValue(key);
                }
            }
            Text {
                id: calendarDetailText
                y: 30
                anchors.left: parent.left
                anchors.leftMargin: 5
                text: clickedEvent;
                wrapMode: Text.WordWrap
                color: calendar.txtcolor
                font { family: "Verdana"; pointSize: dateSize; bold: true; }
            }
            Image {
                id: close
                anchors.top: parent.top
                anchors.right: parent.right
                width: 16
                height: 16
                source: "images/close_btn.png"
                MouseArea {
                    anchors.fill: parent
                    onPressed:  {
                        dark.visible = false;
                        calendarDetail.visible = false;
                        addEvents.visible = false;
                    }
                }
            }

            Rectangle {
                id: create
                x: 250
                anchors.top: parent.top
                anchors.topMargin: 3
                width: 50
                height: 18
                radius: 3
                color: "black"

                Text {
                    anchors.centerIn: parent
                    text: "CREATE"
                    color: calendar.txtcolor
                    font { family: "Verdana"; pointSize: dateSize; bold: false; }
                }

                MouseArea {
                    anchors.fill: parent
                    onClicked:  {
                        dark.visible = false;
                        startSpeechRecognitionReq("calendar", 5000);
                    }
                }
            }
        }
    }

    onVisibleChanged: {
        setTheme();
        var dateTime = new Date();
        calendar.dateChanged(calendar, dateTime, sign);
    }
}

